import React, { Component } from 'react';
import { View, Text, StyleSheet, } from 'react-native';
import { orderBaseStyle } from '../_common/style';
import { GLOBAL } from '../../../../config/global';
import { TitleCpt } from '../_components/TitleCpt';
const scale = GLOBAL.SCALE;
export class AdressCBlock extends Component {
	constructor(props) {
		super(props);
		console.log('运输-模块', props)
		let { initData, editData } = this.props.data || {};
		this.state = {
			initData: initData || {},
			editData: editData || {}
		}
	}
	componentWillReceiveProps (props) {
		let { initData, editData } = props.data || {};
		console.log('props.data-99999', props.data)
		this.setState({
			initData: initData || {},
			editData: editData || {}
		})
	}

	_moreFn = () => {
		let { initData, editData } = this.state;
		let { navigation, addressBack } = this.props.data || {};
		navigation.navigate('AdressPage', {
			initData,
			editData,
			callBack: (payData) => {
				addressBack && addressBack(payData)
			}
		});
	}
	render () {
		let { editData } = this.props.data || {};
		let { buyData, sellData } = editData || {};
		return (
			<View>
				<View style={orderBaseStyle.box}>
					<TitleCpt
						data={{
							title: '运输信息',
							moreText: !sellData.deliveryType ? '新增' : '修改',
							_moreFn: () => { this._moreFn() },
						}} />
					{
						!sellData.deliveryType ? (<Text style={orderBaseStyle.notgood}>请添加支付信息...</Text>) : (
							<View style={orderBaseStyle.top10}>

								<View style={[styles.row, styles.paddingL20]}>
									<View style={[orderBaseStyle.goodsIconBox, orderBaseStyle.goodsBuy]}><Text style={[orderBaseStyle.goodsIcon]}>采</Text></View>
									<View style={orderBaseStyle.iconTop}>
										<View style={[styles.row, { flexWrap: 'wrap' }]}>
											<Text style={orderBaseStyle.fontSize14}>{buyData.deliveryTypeName}</Text>
											{sellData.transportTypeName ? <Text style={orderBaseStyle.fontSize14}>丨{sellData.transportTypeName}</Text> : null}
											{
												sellData.logisticsFee ? <Text style={orderBaseStyle.fontSize14}>丨运费成本{sellData.logisticsFee}元/吨</Text> : null
											}
											{
												sellData.lostRenderName ? <Text style={orderBaseStyle.fontSize14}>丨{sellData.lostRenderName}承损</Text> : null
											}
											{
												sellData.lostRateBig ? <Text style={orderBaseStyle.fontSize14}>丨千分之{sellData.lostRateBig}(途损率)</Text> : null
											}
										</View>
									</View>
								</View>

								<View style={[styles.row, styles.paddingL20]}>
									<View style={[orderBaseStyle.goodsIconBox, orderBaseStyle.goodsSell]}><Text style={[orderBaseStyle.goodsIcon]}>销</Text></View>
									<View style={orderBaseStyle.iconTop}>
										<View style={[styles.row, { flexWrap: 'wrap' }]}>
											<Text style={orderBaseStyle.fontSize14}>{sellData.deliveryTypeName}</Text>
											{sellData.transportTypeName ? <Text style={orderBaseStyle.fontSize14}>丨{sellData.transportTypeName}</Text> : null}
											{
												sellData.logisticsFee ? <Text style={orderBaseStyle.fontSize14}>丨运费成本{sellData.logisticsFee}元/吨</Text> : null
											}
											{
												sellData.lostRenderName ? <Text style={orderBaseStyle.fontSize14}>丨{sellData.lostRenderName}承损</Text> : null
											}
											{
												sellData.lostRateBig ? <Text style={orderBaseStyle.fontSize14}>丨千分之{sellData.lostRateBig}(途损率)</Text> : null
											}
										</View>
									</View>
								</View>
								{sellData.srcAddress ? <Text style={[orderBaseStyle.address, styles.mb20]}>{'出库地：' + sellData.srcAddress || ''}</Text> : null}
								{sellData.destAddress ? <Text style={[orderBaseStyle.address, styles.mb20]}>{'目的地：' + sellData.destAddress || ''}</Text> : null}
							</View>
						)
					}


				</View>

			</View >
		)
	}
}
const styles = StyleSheet.create({
	radioTitle: {
		fontSize: 14 * scale,
		color: '#333',
		paddingBottom: 15 * scale,
		paddingLeft: 10 * scale,
		paddingTop: 15 * scale
	},
	required: {
		fontSize: 14 * scale,
		color: '#D0021B'
	},
	row: {
		flexDirection: 'row',
	},
	paddingL20: {
		paddingLeft: 10 * scale,
		paddingBottom: 15 * scale
	},
	mt5: {
		marginTop: 2 * scale
	},
	mb20: {
		marginBottom: 20 * scale
	}
})

